<template>
    <el-dialog v-model="dialogFormVisible" :title="title" @close="closeDialog">
        <el-form :model="addBaseWageTypeForm" ref="addBaseWageTypeRef" :rules="addBaseWageTyperules">
            <el-form-item label="项目名称" :label-width="formLabelWidth" prop="wageName">
                <el-input v-model="addBaseWageTypeForm.wageName" autocomplete="off" ref="name" placeholder="请填写项目名称">
                </el-input>
            </el-form-item>
            <el-form-item label="工资类型" :label-width="formLabelWidth" prop="wageType">
                <el-select v-model="addBaseWageTypeForm.wageType" placeholder="请选择工资类型" clearable>
                    <el-option :value="1" label="通用工资"></el-option>
                    <el-option :value="2" label="国拨"></el-option>
                    <el-option :value="3" label="校内"></el-option>
                    <el-option :value="4" label="奖金"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="工资结构" :label-width="formLabelWidth" prop="wageStructure">
                <el-select v-model="addBaseWageTypeForm.wageStructure" placeholder="请选择工资结构">
                    <el-option :value="1" label="应发工资"></el-option>
                    <el-option :value="2" label="应扣工资"></el-option>
                </el-select>
            </el-form-item>
            <!-- <el-form-item label="数值类型" :label-width="formLabelWidth" prop="valueType" v-if="addBaseWageTypeForm.id">
                <el-input v-model="addBaseWageTypeForm.valueType" autocomplete="off" ref="name" placeholder="请填写数值类型">
                </el-input>
            </el-form-item> -->
            <el-form-item label="是否统计" :label-width="formLabelWidth" prop="isStatistics" >
                <el-select v-model="addBaseWageTypeForm.isStatistics" placeholder="请选择是否统计">
                    <el-option :value="1" label="统计"></el-option>
                    <el-option :value="2" label="不统计"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="权重" :label-width="formLabelWidth" prop="sortId" >
                <el-input v-model="addBaseWageTypeForm.sortId" type="number" autocomplete="off" ref="name" placeholder="请填写权重">
                </el-input>
            </el-form-item>
            <!-- <el-form-item label="0启用、1禁用" :label-width="formLabelWidth" prop="enabled" v-if="addBaseWageTypeForm.id">
                <el-input v-model="addBaseWageTypeForm.enabled" autocomplete="off" ref="name" placeholder="请填写0启用、1禁用">
                </el-input>
            </el-form-item>
            <el-form-item label="是否删除" :label-width="formLabelWidth" prop="isDelete" v-if="addBaseWageTypeForm.id">
                <el-input v-model="addBaseWageTypeForm.isDelete" autocomplete="off" ref="name" placeholder="请填写是否删除">
                </el-input>
            </el-form-item>
            <el-form-item label="校区" :label-width="formLabelWidth" prop="campus" v-if="addBaseWageTypeForm.id">
                <el-input v-model="addBaseWageTypeForm.campus" autocomplete="off" ref="name" placeholder="请填写校区">
                </el-input>
            </el-form-item> -->
        </el-form>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="cancel()">取消</el-button>
                <el-button type="primary" @click="save()">保存</el-button>
            </span>
        </template>
    </el-dialog>
</template>

<script>
import { ref } from "vue";
import { httpService } from "@/utils/httpService";
import { ElMessage, ElForm } from "element-plus";
import { vxRule } from "@/utils/validator";

export default {
    name: "AddBaseWageType",
    components: { ElForm, ElMessage },
    data() {
        return {
            dialogFormVisible: ref(false),
            formLabelWidth: "120px",
            title: "",
            personnelType: "",
            addBaseWageTypeForm: {
                wageName: "",
                wageType: "",
                wageStructure: "",
                valueType: "",
                isStatistics: "",
                sortId: "",
                enabled: "",
                isDelete: "",
                campus: "",
            },
            // 校验规则
            addBaseWageTyperules: {
                wageName: vxRule(true, null, "blur"),
                wageType: vxRule(true, null, "blur"),
                wageStructure: vxRule(true, null, "blur"),
                wageStructure: vxRule(true, null, "blur"),
                isStatistics: vxRule(true, null, "blur"),
                sortId: vxRule(true, null, "blur"),
            },
        };
    },
    methods: {
        closeDialog() {
            this.clear();
        },
        cancel() {
            this.dialogFormVisible = false;
            this.clear();
        },
        getBaseWageTypeById(id) {
            httpService("/javaApi/baseWageType/queryById", { id: id }, "get").then(
                (data) => {
                    this.addBaseWageTypeForm = data;
                }
            );
        },
        clear() {
            this.dialogFormVisible = false;
            //清空form
            this.addBaseWageTypeForm.id = "";
            this.addBaseWageTypeForm.wageName = "";
            this.addBaseWageTypeForm.wageType = "";
            this.addBaseWageTypeForm.wageStructure = "";
            this.addBaseWageTypeForm.valueType = "";
            this.addBaseWageTypeForm.isStatistics = "";
            this.addBaseWageTypeForm.sortId = "";
            this.addBaseWageTypeForm.enabled = "";
            this.addBaseWageTypeForm.isDelete = "";
            this.addBaseWageTypeForm.campus = "";
        },
        save() {
            this.$refs.addBaseWageTypeRef.validate((valid) => {
                if (valid) {
                    let params = new FormData(); //创建一个form对象,必须是form对象否则后端接受不到数据
                    params.append("wageName", this.addBaseWageTypeForm.wageName);
                    params.append("wageType", this.addBaseWageTypeForm.wageType);
                    params.append("wageStructure", this.addBaseWageTypeForm.wageStructure);
                    // params.append("valueType", this.addBaseWageTypeForm.valueType);
                    params.append("isStatistics", this.addBaseWageTypeForm.isStatistics);
                    params.append("sortId", this.addBaseWageTypeForm.sortId);
                    // params.append("enabled", this.addBaseWageTypeForm.enabled);
                    // params.append("isDelete", this.addBaseWageTypeForm.isDelete);
                    // params.append("campus", this.addBaseWageTypeForm.campus);
                    if (this.addBaseWageTypeForm.id) {
                        params.append("id", this.addBaseWageTypeForm.id);
                        httpService("/javaApi/baseWageType/edit", params, "post").then(
                            (data) => {
                                if (data.code == 200) {
                                    ElMessage.success("修改成功");
                                    this.clear();
                                    //刷新父组件的数据
                                    this.$parent.getBaseWageTypeList();
                                } else {
                                    ElMessage.error("修改失败");
                                }
                            }
                        );
                    } else {
                        httpService("/javaApi/baseWageType/add", params, "post").then(
                            (data) => {
                                if (data.code == 200) {
                                    ElMessage.success("添加成功");
                                    this.clear();
                                    //刷新父组件的数据
                                    this.$parent.getBaseWageTypeList();
                                } else {
                                    ElMessage.error("添加失败");
                                }
                            }
                        );
                    }
                } else {
                    return false;
                }
            });
        },
    },
};
</script>
<style>
.el-select{
    width: 100%;
}

</style>